import React, { Component } from "react";
import "./index.css";
// 组件
import MyTabBar from "../../compoents/MyTabBar";
import { Route } from "react-router-dom";
// 页面
import News from "../News";
import HouseList from "../HouseList";
import Index from "../Index";
import PersonalPage from "../PersonalPage";

// 引入 react-redux 进行ui 和 容器的连接
import { connect } from "react-redux";

class Home extends Component {
  constructor(props) {
    super(props);
    console.log("首页加载~欢迎来到这里");
  }

  // 路由跳转
  pushHistory = (pathName) => {
    this.props.history.push(pathName);
  };

  render() {
    const { isHiddenTabBar } = this.props;

    return (
      <div className="home">
        <Route exact path="/home" component={Index}></Route>
        <Route path="/home/houseList" component={HouseList}></Route>
        <Route path="/home/news" component={News}></Route>
        <Route path="/home/personal" component={PersonalPage}></Route>

        <MyTabBar
          isHidden={isHiddenTabBar}
          pushHistory={this.pushHistory}
          localPathName={this.props.location.pathname}
        ></MyTabBar>
      </div>
    );
  }
}

export default connect((state) => {
  return { isHiddenTabBar: state.isHiddenTabBAR };
}, {})(Home);
